import { PROJ_CFG_KEY,ProjectSetting, ThemeColorEnum } from '@/config'
import type { ProjectSetting as ProType } from "@/types/config"
import { MetaStorage } from '@/utils'
import { defineStore } from 'pinia'
import { ComputedRef, computed, ref } from 'vue'

export const useProjectStore = defineStore('project', () => {

    let projectConfig = ref<ProType>(MetaStorage.getSession(PROJ_CFG_KEY) ?? ProjectSetting)
    
    let themeColor: ComputedRef<ThemeColorEnum> = computed(() => projectConfig.value.themeColor)

    let isMobile: ComputedRef<boolean> = computed(() => projectConfig.value.isMobile)

    function setThemeColor(val:ThemeColorEnum){
        projectConfig.value.themeColor = val
        upDateStorage(projectConfig.value)
    }

    function setIsMobile(val:boolean){
        projectConfig.value.isMobile = val
        upDateStorage(projectConfig.value)
    }

    function setProjectConfig(config: ProType) {
        projectConfig.value = config
       upDateStorage(config)
    }

    function upDateStorage(config: ProType){
        MetaStorage.setSessionDeep(PROJ_CFG_KEY, config)
    }

    return {
        projectConfig,
        themeColor,
        isMobile,
        setThemeColor,
        setIsMobile,
        setProjectConfig
    }
})